<script setup>
import { ref } from 'vue'
import { useUserStore } from '@/store'
import { fetchWithdrawalStatement } from '@/api/withdraw.js'
import Records from './records.vue'

const loading = ref(true)

const userStore = useUserStore()

const coinFlow = ref([])
async function fetchCashFlow() {
    try {
        const res = await fetchWithdrawalStatement({
            currency: 1, // 金币
            device: userStore.uuid
        })
        coinFlow.value = res.data.data.accountFlows
    } catch (error) {
        console.error(error)
    }
    loading.value = false
}
fetchCashFlow()
</script>

<template>
    <van-loading v-if="loading" style="position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);" vertical
        color="#f2456b" text-color="#f2456b">
        Loading...
    </van-loading>
    <Records :data="coinFlow" v-else :symbol="false" />
</template>

<style scoped></style>